<html>

<head>

    <meta charset="utf-8" />

<body>

    <canvas id='game' width='400' height='400'></canvas>
    <script>
        function loadText(url) {
            return new Promise((resolve, reject) => {
                const xhr = new XMLHttpRequest();
                xhr.onload = () => {
                    resolve(xhr.responseText);
                }
                xhr.open('get', url);
                xhr.send();
            })
        }

        function loadScript(url) {
            return new Promise((resolve, reject) => {
                const script = document.createElement("script");
                script.onload = () => resolve();
                script.src = url;
                document.body.appendChild(script)

            })
        }
        async function run() {
            // const content = await loadText('./data/scripts.json');
            // const javascriptFiles = JSON.parse(content);

            const content = await loadText('./data/config.json');
            window['configData'] = JSON.parse(content)
            const javascriptFiles = window['configData'].scripts;

            for (let item of javascriptFiles) {
                await loadScript(item);
            }
        }
        run();
    </script>

</body>


</head>

</html>